<!--
 * @Author: your name
 * @Date: 2021-08-04 16:05:39
 * @LastEditTime: 2021-12-24 19:00:31
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \jinfeng_up\src\views\task\taskDetails\taskDetails.vue
-->
<template>
    <div class="taskDetail">
        <!-- appendToBody -->
        <el-page-header class="header" @back="toTask" content="">
            <template slot="title"> 任务总览 - 任务详情 </template>
            <template slot="content">
                <template >
                    <el-button
                        v-show="detailsForm.showCloseTag"
                        class="option_btn"
                        @click="closeRow"
                        v-has="'M1109001'"
                        >关闭</el-button
                    >
                    <el-button
                        v-show="detailsForm.showActivationTag"
                        class="option_btn"
                        @click="activeRow"
                        v-has="'M1109002'"
                        >激活</el-button
                    >
                    <el-button
                        v-show="detailsForm.showAssignTag"
                        class="option_btn"
                        @click="transferRow"
                        v-has="'M1109003'"
                        >转让</el-button
                    >
                    <el-button
                        v-show="detailsForm.showConfirmTag"
                        class="option_btn"
                        @click="confirm"
                        v-has="'M1109004'"
                        >确认</el-button
                    >
                    <el-button
                        class="option_btn"
                        v-show="detailsForm.showProgressTag"
                        @click="updateRow"
                        v-has="'M1109005'"
                        >更新进度</el-button
                    >
                    <el-button
                        class="option_btn"
                        v-show="detailsForm.showCommonButton"
                        @click="updateRows"
                        v-has="'M1109007'"
                        >评论</el-button
                    >
                    <el-button
                        class="option_btn"
                        v-show="detailsForm.showApplyMeeting"
                        @click="applicationRow"
                        v-has="'M1109006'"
                        >申请上会</el-button
                    >
                </template>
            </template>
        </el-page-header>

        <div class="container">
            <div class="containerInfo">
                <el-row type="flex" class="row-bg" justify="space-between">
                    <el-col :span="15">
                        <div class="leftContainer" style="background: #fff; padding: 15px; border-radius: 5px">
                            <div class="leftTop">
                                <el-form
                                    :model="detailsForm"
                                    ref="detailsForm"
                                    class="detailsForms"
                                    label-width="126px"
                                >
                                    <el-row :gutter="10">
                                        <el-col :span="12">
                                            <el-form-item label="任务ID">
                                                <el-input
                                                    v-model="detailsForm.id"
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="所属产品">
                                                <el-input
                                                    v-model="
                                                        detailsForm.productName
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="12">
                                            <el-form-item label="任务状态">
                                                <div class="dataClass liuchengjiedian">{{
                                                    detailsForm.status
                                                        | transferSeverity(
                                                            taskStatusList
                                                        )
                                                }}</div>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="关联反馈ID">
                                                <el-input
                                                    v-model="
                                                        detailsForm.feedBackId
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="12">
                                            <el-form-item label="任务标识">
                                                <div class="dataClass dddddd">{{
                                                    detailsForm.ctag | transTags
                                                }}</div>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="计划完成时间">
                                                <el-input
                                                    v-model="
                                                        detailsForm.expectedCompletedDate
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="12">
                                            <el-form-item label="当前责任人" >
                                                <el-input
                                                    v-model="
                                                        detailsForm.responsibleUserName
                                                    "
                                                    disabled
                                                    class="liuchengjiedian"
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="责任人部门">
                                                <el-input
                                                    v-model="
                                                        detailsForm.responsibleUserDept
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="12">
                                            <el-form-item label="创建人">
                                                <el-input
                                                    v-model="
                                                        detailsForm.createUserName
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <el-form-item label="创建人部门">
                                                <el-input
                                                    v-model="
                                                        detailsForm.createUserDep
                                                    "
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="24">
                                            <el-form-item label="任务标题">
                                                <el-input
                                                    v-model="detailsForm.title"
                                                    disabled
                                                ></el-input>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                    <el-row :gutter="10">
                                        <el-col :span="24" class="specialCol">
                                            <el-form-item label="跟踪事项">
                                                <div
                                                    @dblclick="aboutDetailImage"
                                                >
                                                    <quill-editor
                                                        class="notshown"
                                                        v-model="
                                                            detailsForm.trackingTip
                                                        "
                                                        ref="notesQuillEditor"
                                                        disabled
                                                    >
                                                    </quill-editor>
                                                </div>
                                            </el-form-item>
                                        </el-col>
                                    </el-row>
                                </el-form>
                            </div>
                            <div class="leftBottom">
                                <el-row
                                    type="flex"
                                    class="row-bg"
                                    justify="space-between"
                                >
                                    <el-col :span="11" style="height: 100%">
                                        <el-card
                                            class="textCards"
                                            shadow="never"
                                        >
                                            <div class="detailTitle">
                                                超期会议
                                            </div>
                                            <div
                                                v-for="(
                                                    item, index
                                                ) in aboutMettingData"
                                                :key="index"
                                            >
                                                <span
                                                    >会议主题：{{ item }}</span
                                                >
                                                <br />
                                            </div>
                                        </el-card>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-card
                                            class="textCardS"
                                            shadow="never"
                                        >
                                            <div class="detailTitle">
                                                任务处理时长信息
                                            </div>
                                            <el-row
                                                v-if="detailsForm.ctag == 0"
                                            >
                                                <el-col :span="12">
                                                    <div>C1环激活次数</div>
                                                </el-col>
                                                <el-col :span="12">
                                                    <div>
                                                        {{
                                                            detailsForm.c1ActiveCount
                                                        }}次
                                                    </div>
                                                </el-col>
                                            </el-row>
                                            <el-row
                                                v-if="detailsForm.ctag == 0"
                                            >
                                                <el-col :span="12">
                                                    <div>C1环处理总时长</div>
                                                </el-col>
                                                <el-col :span="12">
                                                    <div>
                                                        {{
                                                            detailsForm.c1DurationSecond
                                                        }}
                                                    </div>
                                                </el-col>
                                            </el-row>
                                            <el-row
                                                v-if="detailsForm.ctag == 1"
                                            >
                                                <el-col :span="12">
                                                    <div>C2环激活次数</div>
                                                </el-col>
                                                <el-col :span="12">
                                                    <div>
                                                        {{
                                                            detailsForm.c2ActiveCount
                                                        }}次
                                                    </div>
                                                </el-col>
                                            </el-row>
                                            <el-row
                                                v-if="detailsForm.ctag == 1"
                                            >
                                                <el-col :span="12">
                                                    <div>C2环处理总时长</div>
                                                </el-col>
                                                <el-col :span="12">
                                                    <div>
                                                        {{
                                                            detailsForm.c2DurationSecond
                                                        }}
                                                    </div>
                                                </el-col>
                                            </el-row>
                                            <!-- 任务处理时长信息<br> C2环激活次数
                <br> 关闭任务
                <br> 任务处理时长信息 -->
                                        </el-card>
                                    </el-col>
                                </el-row>
                            </div>
                        </div>
                    </el-col>
                    <el-col :span="8">
                        <div class="rightTop">
                            <div class="detailTitle">任务进展记录区域</div>
                            <ul>
                                <li
                                    v-for="(
                                        item, index
                                    ) in taskOperationLogList"
                                    :key="index"
                                    class="underLineSty"
                                    @dblclick="
                                        lookInLargeScreen(item.logContent)
                                    "
                                >
                                    <div class="logDetail">
                                        <div class="logDetailHeader">
                                            <span class="serialNum">{{
                                                index + 1
                                            }}</span>
                                            <span>{{ item.createTime }}</span>
                                        </div>
                                        <div
                                            class="logDetailFooter"
                                            v-html="item.logContent"
                                        ></div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </div>
        <!-- 大图展示区域 -->
        <CommonDialog
            title="图片"
            width="75%"
            v-bind:dialogVisible="detailedContentDialogVisible"
            @on-change-dialogVisible="detailedContentChange"
            class="lookInfo"
            top="5vh"
        >
            <template #body>
                <div class="detailedContentDisplay" v-html="detailedContent">
                    {{ detailedContent }}
                </div>
            </template>
        </CommonDialog>
        <!-- 弹出框汇总 -->
        <!-- 关闭弹出框 -->
        <CommonDialog
            title="关闭"
            width="75%"
            v-bind:dialogVisible="closeDialogVisible"
            @on-change-dialogVisible="closeChange"
            class="close"
            top="10vh"
        >
            <template #body>
                <el-form
                    class="closeForm"
                    :model="closeForm"
                    ref="closeForm"
                    :rules="closeFormRules"
                    label-width="100"
                    label-position="top"
                >
                    <el-form-item
                        label="关闭原因"
                        class="closeReason"
                        prop="reason"
                    >
                        <el-select
                            v-model="closeForm.reason"
                            placeholder="关闭原因"
                        >
                            <el-option
                                v-for="(item, index) in closeReasonList"
                                :key="index"
                                :label="item.text"
                                :value="item.id"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item
                        label="备注"
                        class="extra closeReason"
                        prop="remark"
                    >
                        <socialUpload
                            :contentDefault="closeForm.remark"
                            @getContent="getCloseRemark"
                        ></socialUpload>
                    </el-form-item>
                </el-form>
            </template>
            <template #dialog_footer>
                <el-button size="small" @click="closeCancel">取 消</el-button>
                <el-button
                    type="primary"
                    @click="confirmCloseRow('closeForm')"
                    size="small"
                    >确认</el-button
                >
            </template>
        </CommonDialog>

        <!-- 激活弹出框 -->
        <CommonDialog
            title="激活"
            width="75%"
            v-bind:dialogVisible="isactiveDialogVisible"
            @on-change-dialogVisible="activeChange"
            class="startForm"
            top="10vh"
        >
            <template #body>
                <el-form
                    :model="activeForm"
                    label-position="top"
                    ref="activeForm"
                    :rules="activeFormRules"
                    label-width="100"
                >
                    <el-form-item label="激活原因" prop="tips">
                        <!-- <el-input type="textarea" v-model="activeForm.tips">
            </el-input> -->
                        <socialUpload
                            :contentDefault="activeForm.tips"
                            @getContent="getActiveTips"
                        ></socialUpload>
                    </el-form-item>
                </el-form>
            </template>

            <template #dialog_footer>
                <el-button size="small" @click="activeCancel">取 消</el-button>

                <el-button
                    type="primary"
                    @click="activeConfirm('activeForm')"
                    size="small"
                    >确认</el-button
                >
            </template>
        </CommonDialog>

        <!-- 转让弹出框 -->
        <CommonDialog
            title="转让"
            width="75%"
            v-bind:dialogVisible="transferDialogVisible"
            @on-change-dialogVisible="transferChange"
            class="close"
            top="10vh"
        >
            <template #body>
                <el-form
                    :model="transferForm"
                    label-position="top"
                    ref="transferForm"
                    label-width="100"
                    :rules="transferFormRules"
                >
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="接收人" prop="userid">
                                <el-select
                                    v-model="transferForm.userid"
                                    clearable
                                    filterable
                                >
                                    <el-option
                                        v-for="item in transferUserList"
                                        :key="item.id"
                                        :label="item.name"
                                        :value="item.id"
                                    >
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="转让原因" prop="reason">
                                <!-- <el-input type="textarea" v-model="transferForm.reason">
                </el-input> -->
                                <socialUpload
                                    :contentDefault="transferForm.reason"
                                    @getContent="getTranSferReason"
                                ></socialUpload>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </template>

            <template #dialog_footer>
                <el-button size="small" @click="transferCancel"
                    >取 消</el-button
                >

                <el-button
                    type="primary"
                    size="small"
                    @click="confirmtransfer('transferForm')"
                    >确认</el-button
                >
            </template>
        </CommonDialog>

        <!-- 更新进度弹出框 -->
        <CommonDialog
            title="更新进度"
            width="75%"
            v-bind:dialogVisible="updateDialogVisible"
            @on-change-dialogVisible="updateChange"
            class="activeForm"
            top="10vh"
        >
            <template #body>
                <el-form
                    class="suspendForm"
                    :model="updateForm"
                    label-position="top"
                    ref="updateForm"
                    :rules="updateFormRules"
                >
                    <el-form-item
                        label="任务详情"
                        class="suspendReason"
                        prop="context"
                    >
                        <!-- <el-input type="textarea" v-model="updateForm.context">
            </el-input> -->
                        <socialUpload
                            :contentDefault="updateForm.context"
                            @getContent="getUpdateContent"
                        ></socialUpload>
                    </el-form-item>
                </el-form>
            </template>

            <template #dialog_footer>
                <el-button size="small" @click="updateCancel">取 消</el-button>

                <el-button
                    type="primary"
                    size="small"
                    @click="confirmUpadte('updateForm')"
                    >确认</el-button
                >
            </template>
        </CommonDialog>
        <!-- 更新进度弹出框 -->
        <CommonDialog
            title="评论"
            width="75%"
            v-bind:dialogVisible="updateDialogVisibles"
            @on-change-dialogVisible="updateChanges"
            class="activeForm"
            top="10vh"
        >
            <template #body>
                <el-form
                    class="suspendForm"
                    :model="updateForm"
                    label-position="top"
                    ref="updateForm"
                    :rules="updateFormRules"
                >
                    <el-form-item
                        label="评论"
                        class="suspendReason"
                        prop="context"
                    >
                        <!-- <el-input type="textarea" v-model="updateForm.context">
            </el-input> -->
                        <socialUpload
                            :contentDefault="updateForm.context"
                            @getContent="getUpdateContent"
                        ></socialUpload>
                    </el-form-item>
                </el-form>
            </template>

            <template #dialog_footer>
                <el-button size="small" @click="updateCancels">取 消</el-button>

                <el-button
                    type="primary"
                    size="small"
                    @click="confirmUpadtes('updateForm')"
                    >确认</el-button
                >
            </template>
        </CommonDialog>
        <ApplicationDialog ref="ApplicationDialog" @refreshPage="onSearch" />
    </div>
</template>
<script>
/* 引入请求服务 */

import socialUpload from '@/components/socialUpload/socialUpload.vue'
import { taskPandect } from '@/api/tasks/server'
import { FeedBack } from '@/api/feedBack/server'
// import tinymceeditor from '@/components/tinymceEditer/tinymceEditer.vue'
/* 引入通用的弹出框 */
import CommonDialog from '../../../components/commonDialog/commonDialog.vue'
import ApplicationDialog from '@/components/taskApplicationDialog/taskApplicationDialog.vue'

export default {
    name: 'taskDetails',
    components: {
        CommonDialog,
        socialUpload,
        ApplicationDialog
    },
    props: {},
    data() {
        return {
            detailedContent: '',
            taskStatusList: [
                {
                    label: '新建',
                    value: 0
                },
                {
                    label: '处理中',
                    value: 1
                },
                {
                    label: '已完成',
                    value: 2
                }
            ],
            taskCommonId: '',

            detailsForm: {
                id: '', // 主键
                feedBackId: '', //	关联反馈主键
                productName: '', // 所属产品
                ctag: '', // 任务标识
                expectedCompletedDate: '', // 计划完成时间
                responsibleUser: '', // 责任人
                responsibleUserDept: '', // 责任人部门
                responsibleUserId: '', // 责任人id
                trackingTip: '', // 跟踪事项
                status: '' // 任务状态
            },
            taskOperationLogList: [],
            label_style: { width: '150px' },
            content_style: { width: '340px', userSelect: 'none' },
            content_styles: { width: '540px', userSelect: 'none' },

            /* 控制弹出框的显示或隐藏 */
            createTaskDialogVisible: false, // 创建
            closeDialogVisible: false, // 关闭
            isactiveDialogVisible: false, // 激活
            transferDialogVisible: false, // 转让
            updateDialogVisible: false, // 更新
            updateDialogVisibles: false, // 更新
            detailedContentDialogVisible: false, // 大图展示区域
            /* 弹出框表单验证规则 */
            /* 关闭 */
            closeFormRules: {
                reason: [{ required: true, message: '请输入关闭原因', trigger: 'change' }],
                remark: [{ required: false, message: '请输入备注', trigger: 'blur' }]
            },

            /* 激活 */
            activeFormRules: {
                tips: [{ required: true, message: '请输入激活原因', trigger: 'change' }]
            },

            /* 转让 */
            transferFormRules: {
                userid: [{ required: true, message: '请选择接收人', trigger: 'change' }],
                reason: [{ required: true, message: '请输入转让原因', trigger: 'blur' }]
            },

            /* 更新 */
            updateFormRules: {
                context: [{ required: true, message: '请输入跟踪事项', trigger: 'change' }]
            },

            /* 弹出框请求列表 */
            closeReasonList: [],
            // 转让人列表
            transferUserList: [],

            /* 弹出框表单 */
            // 创建
            createTaskForm: {
                productId: '',
                productName: '',
                taskStatus: '',
                TheirProducts: '',
                taskIdentity: 'C2',
                closingDate: '',
                currentResponsiblePerson: '',
                department: '',
                trackItems: ''
            },
            // 关闭
            closeForm: {
                reason: '',
                remark: '',
                solution: ''
            },
            // 激活
            activeForm: {
                tips: ''
            },
            // 转让
            transferForm: {
                reason: '',
                userid: ''
            },
            // 更新
            updateForm: {
                context: ''
            },

            // 超期会议数据
            aboutMettingData: []
        }
    },
    computed: {},
    watch: {},
    created() { },
    mounted() {
        console.log(this.$route.query.id)
        this.queryTaskDetailById(this.$route.query.id)
        this.getcloseReasonList() // 任务关闭原因列表
    },
    filters: {
        transferSeverity(_val, _list) {
            let str = ''
            _list.findIndex(_item => {
                if (_item.value === _val) {
                    str = _item.label
                    return true
                } else {
                    return false
                }
            })
            return str
        },
        transTags(v) {
            console.log(v)
            if (v === 0) {
                return 'C1'
            } else {
                return 'C2'
            }
        }
    },

    methods: {
        detailedContentChange() {
            this.detailedContentDialogVisible = false
            this.detailedContent = ''
        },
        aboutDetailImage() {
            if (this.detailsForm.trackingTip.indexOf('<img') != -1) {
                const imgReg = /<img.*?(?:>|\/>)/gi
                const imgArray = this.detailsForm.trackingTip.match(imgReg)
                if (imgArray.length > 0) {
                    this.detailedContentDialogVisible = true
                }
                for (const i in imgArray) {
                    if (Object.hasOwnProperty.call(imgArray, i)) {
                        const element = imgArray[i]
                        this.detailedContent += element
                    }
                }
            }
        },
        lookInLargeScreen(content) {
            // console.log(content)
            if (content.indexOf('<img') != -1) {
                const imgReg = /<img.*?(?:>|\/>)/gi
                this.detailedContentDialogVisible = true
                const imgArray = content.match(imgReg)
                for (const i in imgArray) {
                    if (Object.hasOwnProperty.call(imgArray, i)) {
                        const element = imgArray[i]
                        this.detailedContent += element
                    }
                }
            }
        },
        onSearch() {
            this.queryTaskDetailById(this.$route.query.id)
        },
        /* 获取数据 */
        async queryTaskDetailById(id) {
            try {
                const result = await taskPandect.GetInfoByIdAsync({ id: id })
                if (result.success) {
                    this.taskOperationLogList = result.data.taskOperationLogList
                    this.detailsForm = result.data
                    console.log('详情页面', result.data)
                    this.aboutMettingData = result.data.meetingList
                    // console.log('超期会议数据Data', this.aboutMettingData)
                    // console.log('详情页面日志详情data', result.data.taskOperationLogList)
                }
            } catch (err) {
                console.log(err)
            }
        },
        focustip(event) {
            event.enable(false) // 设置富文本编辑器不可编辑
        },
        onEditorReady(event) {
            event.enable(false) // 设置富文本编辑器不可编辑
        },
        /* 回到任务总览页面 */
        toTask() {
            if (this.$route.query.activeName != null) {
                if (this.$route.query.overRangeMetting != null) {
                    this.$router.push({
                        path:
                            'myWait?activeName=' +
                            this.$route.query.activeName +
                            '&overRangeMetting=' +
                            this.$route.query.overRangeMetting
                    })
                } else {
                    this.$router.push({
                        path: 'myWait?activeName=' + this.$route.query.activeName
                    })
                }
            } else {
                this.$router.go(-1)
            }
        },
        /* 弹出框的系列方法 */
        // 创建任务
        createTask() {
            this.createTaskDialogVisible = true
        },
        createTaskChange(val) {
            this.createTaskDialogVisible = val
        },
        /* 取消 新建任务  */
        createTaskCancel() {
            this.createTaskForm = {
                productId: '',
                productName: '',
                taskStatus: '',
                TheirProducts: '',
                taskIdentity: '',
                closingDate: '',
                currentResponsiblePerson: '',
                department: '',
                trackItems: ''
            }
            this.createTaskDialogVisible = false
        },
        // 关闭方法开始
        closeRow() {
            this.taskCommonId = this.$route.query.id
            this.closeDialogVisible = true
        },
        // 取消关闭
        closeCancel() {
            this.closeDialogVisible = false
        },
        // 回传关闭
        closeChange(val) {
            this.closeDialogVisible = val
            this.$refs['closeForm'].resetFields()
        },
        /* 获得任务关闭原因列表 */
        async getcloseReasonList() {
            try {
                const result = await taskPandect.GetTaskCloseReason()
                if (result.success) {
                    this.closeReasonList = result.data
                    // console.log('任务关闭原因', result.data)
                }
            } catch (err) {
                console.log(err)
            }
        },
        // 关闭 确认
        confirmCloseRow(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    try {
                        const result = await taskPandect.CloseTask({ reason: this.closeForm.reason, remark: this.closeForm.remark, id: this.taskCommonId })
                        if (result.success) {
                            this.queryTaskDetailById(this.$route.query.id)
                            // console.log('关闭成功')
                            this.closeDialogVisible = false
                            this.$refs['closeForm'].resetFields()
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    return false
                }
            })
        },

        // 激活方法开始
        activeRow(val) {
            // console.log(val)
            this.taskCommonId = val
            this.isactiveDialogVisible = true
        },
        // 取消激活
        activeCancel() {
            this.isactiveDialogVisible = false
            this.$refs['activeForm'].resetFields()
        },

        // 回传激活
        activeChange(val) {
            this.isactiveDialogVisible = val
            this.$refs['activeForm'].resetFields()
        },

        // 激活 确认
        activeConfirm(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    try {
                        const result = await taskPandect.Activation({ tips: this.activeForm.tips, id: this.$route.query.id })
                        if (result.success) {
                            // console.log('激活确认成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.activeForm = {
                                tips: ''
                            }
                            this.$refs[formName].resetFields()
                            this.isactiveDialogVisible = false
                        } else {
                            this.$message.error(result.message)
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },

        // 转让方法开始
        /* 点击转让的时候 ，同时根据产品ID查询指派人 */
        async transferRow() {
            this.transferDialogVisible = true
            this.transferUserList = []
            try {
                const result = await FeedBack.GetListItemAsync({
                    id: this.$route.query.productId
                })

                if (result.success) {
                    this.transferUserList = result.data
                    // console.log('Task_转让责任人', result.data)
                }
            } catch (err) {
                console.log(err)
            }
        },

        // 取消 转让
        transferCancel() {
            this.transferDialogVisible = false
            this.$refs['transferForm'].resetFields()
        },

        // 回传 转让
        transferChange(val) {
            this.transferDialogVisible = val
            this.$refs['transferForm'].resetFields()
        },

        // 转让 确认
        confirmtransfer(formName) {
            const objparams = {
                reason: this.transferForm.reason
            }
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    // console.log(objparams)
                    // console.log('验证通过')
                    try {
                        const result = await taskPandect.TransferTask({ reason: objparams.reason, id: this.$route.query.id, userId: this.transferForm.userid })
                        if (result.success) {
                            // console.log('转让成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.transferForm = {
                                reason: '',
                                userid: ''
                            }
                            this.transferDialogVisible = false
                            this.$refs[formName].resetFields()
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },

        // 取消 更新
        updateCancel() {
            this.updateDialogVisible = false
            this.$refs['updateForm'].resetFields()
        },
        // 取消 更新
        updateCancels() {
            this.updateDialogVisibles = false
            this.$refs['updateForm'].resetFields()
        },

        // 更新方法开始
        updateRow() {
            this.updateDialogVisible = true
        },
        // 更新方法开始
        updateRows() {
            this.updateDialogVisibles = true
        },

        // 回传 更新
        updateChange(val) {
            this.updateDialogVisible = val
            this.$refs['updateForm'].resetFields()
        },
        // 回传 更新
        updateChanges(val) {
            this.updateDialogVisibles = val
            this.$refs['updateForm'].resetFields()
        },

        // 更新进度确认
        confirmUpadte(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    // console.log('验证通过')
                    try {
                        const result = await taskPandect.UpdateProcess({ context: this.updateForm.context, id: this.$route.query.id })
                        if (result.success) {
                            // console.log('更新进度成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.updateForm = {
                                context: ''
                            }
                            this.$refs[formName].resetFields()
                            this.updateDialogVisible = false
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        // 更新进度确认
        confirmUpadtes(formName) {
            this.$refs[formName].validate(async valid => {
                if (valid) {
                    // console.log('验证通过')
                    try {
                        const result = await taskPandect.UpdateProcesss({ context: this.updateForm.context, id: this.$route.query.id })
                        if (result.success) {
                            // console.log('更新进度成功')
                            this.queryTaskDetailById(this.$route.query.id)
                            this.updateForm = {
                                context: ''
                            }
                            this.$refs[formName].resetFields()
                            this.updateDialogVisibles = false
                        }
                    } catch (err) {
                        console.log(err)
                    }
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        /**
     * @description: 任务详情传值
     * @param {String} V 传入的编辑框绑定的值
     */
        getUpdateContent(V) {
            this.updateForm.context = V
        },
        /**
     * @description: 转让原因传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getTranSferReason(Value) {
            this.transferForm.reason = Value
        },
        /**
     * @description: 关闭备注传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getCloseRemark(Value) {
            this.closeForm.remark = Value
        },
        /**
     * @description: 跟踪事项传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getCreateTrack(Value) {
            this.createTaskForm.trackItems = Value
        },
        /**
     * @description: 跟踪事项传值
     * @param {String} Value  传入的编辑框绑定的值
     */
        getActiveTips(Value) {
            this.activeForm.tips = Value
        },

        // 整体任务确认
        async confirm() {
            try {
                const result = await taskPandect.ConfirmTask({ id: this.$route.query.id })
                if (result.success) {
                    this.$message.success('您确认了任务')
                    this.queryTaskDetailById(this.$route.query.id)
                } else {
                    this.$message.error(result.message)
                }
            } catch (err) {
                console.log(err)
            }
        },
        applicationRow() {
            const str = JSON.stringify(this.detailsForm)
            this.$refs.ApplicationDialog.show(str)
        }
    }
}
</script>
<style scoped lang="less" src="@/views/task/taskDetails/taskDetails.less"></style>
<style scoped lang="less" src="@/assets/style/feedBackDialog.less"></style>
<style scope lang="less">

.detailsForms {
    ::v-deep .el-input__inner {
        width: 100%;
        height: 41px !important;
        border-radius: unset;
        background: #fff;
        border: none;
    }
    ::v-deep .el-select {
        width: 100%;
    }
    .wordContent {
        padding-left: 10px;
        height: 40px !important;
        font-size: 12px;
        font-weight: 400;
        color: #333333;
        line-height: 50px;
    }
    ::v-deep .el-form-item {
        margin: 0;
        border: 1px solid #dcdfe6;
        margin-right: -1px;
        margin-bottom: -1px;
    }
    ::v-deep .el-form-item .el-form-item__label {
        border-right: 1px solid #dcdfe6;
        height: 41px;
        line-height: 50px;
        background-color: #f5f7fa;
    }
}
::v-deep .specialCol .el-form-item__label {
    width: 126px !important;
    min-height: 200px;
    padding-top: 10px;
    // height: 100%!important;
    line-height: unset !important;
}
::v-deep .detailsForms .el-col,
::v-deep .detailsForms .el-row {
    padding: 0 !important;
    margin: 0 !important;
}
::v-deep .notshown .ql-toolbar.ql-snow {
    display: none;
}
::v-deep .notshown .ql-container {
    border: none;
    padding: 0;
}
::v-deep .my-label {
    background-color: red;
}
</style>
<style scoped>
::v-deep .ql-editor li {
    list-style-type: decimal !important;
    list-style-position: inside !important;
}
::v-deep .ql-editor ul > li:before {
    content: "\2022";
}

::v-deep .ql-editor ul > li::marker {
    content: "";
    display: none;
}

::v-deep .ql-editor li:before {
    display: inline-block;
    white-space: nowrap;
    width: 1.2em;
}
.sticky-headers {
    position: sticky;
    top: 0;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    background-color: #fff;
    z-index: 1;
    padding: 0 30px;
}
.dataClass {
    padding-left: 15px;
    line-height: 41px;
    background-color: #f5f7fa;
}
</style>
